<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
		<link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css" />
	</head>
	<body>
		<div class="layui-btn-group">
			<button class="layui-btn" onclick="getCheckItem()">获取选中项</button>
			<button class="layui-btn">全选</button>
			<button class="layui-btn">全不选</button>
		</div>
		<table id="table1"></table>
		<script type="text/html" id="switchTpl">
		  <!-- 这里的 checked 的状态只是演示 -->
		  <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}>
		</script>
	</body>
	<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		//第一个实例
		layui.table.render({
		limits:[10,20,30,100],
		elem: '#table1'
		 ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
		      layout: ['count', 'prev', 'page', 'next', 'skip','limit'] //自定义分页布局
		      //,curr: 5 //设定初始在第 5 页
		      ,groups: 1 //只显示 1 个连续页码
		      ,first: false //不显示首页
		      ,last: false //不显示尾页
		    }
		,height: 500
		,url: 'json/user.json' //数据接口
		,page: true //开启分页
		,cols: [
			[ //表头
			 {type:'checkbox'},
			
				{
					field: 'id',//此处与json数据的key对应
					title: 'ID', //标题
					width: 80,  //单元表格宽度
					edit:'text'
					// sort: true,  //排序
					//fixed: 'left'  //固定在左侧
				}, {
					field: 'username',
					title: '用户名',
					width: 80,
					edit:'text'
				}, {
					field: 'sex',
					title: '性别',
					width: 80,
					sort: true,
					templet: '#switchTpl',
					// edit:'text'
				}, {
					field: 'city',
					title: '城市',
					width: 80,
					edit:'text'
				}, {
					field: 'sign',
					title: '签名',
					width: 177,
					edit:'text'
				}, {
					field: 'experience',
					title: '积分',
					width: 80,
					sort: true,
					edit:'text'
				}, {
					field: 'score',
					title: '评分',
					width: 80,
					sort: true
				}, {
					field: 'classify',
					title: '职业',
					width: 80
				}, {
					field: 'wealth',
					title: '财富',
					width: 135,
					sort: true
				}
			]
		]
		});


		function getCheckItem(){
			var checkStatus = layui.table.checkStatus('table1'); //idTest 即为基础参数 id 对应的值
			 
			console.log(checkStatus.data) //获取选中行的数据
			console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
			console.log(checkStatus.isAll ) //表格是否全选
		}
	</script>
</html>
